<template>
  <div class="has-logo">
    <p @click="goHome" class="system-title">
      <img src="../../assets/logo.png" alt="">
      CMS页面配置系统
    </p>
    <!-- <logo v-if="true" :collapse="isCollapse" /> -->
    <el-menu
      :default-active="activeMenu"
      :collapse="true"
      background-color="#304156"
      text-color="#bfcbd9"
      :unique-opened="true"
      active-text-color="#409EFF"
      :collapse-transition="false"
      mode="vertical"
    >
      <sidebar-item
        v-for="route in permission_routes"
        :key="route.path"
        :item="route"
        :base-path="route.path"
      />
      <!-- <template v-if="addRoutes.length <= 0">
        <li class="menu-nodata">
          暂未配置菜单
        </li>
      </template> -->
    </el-menu>
  </div>
</template>

<script>
// import { mapGetters } from 'vuex'
// import Logo from './Logo'
import SidebarItem from './SidebarItem'

export default {
  components: { SidebarItem },
  data () {
    return {
      sidebar: {
        opened: true,
        withoutAnimation: false
      },
      permission_routes: [{'path': '/', 'component': {'name': 'Vuex', 'components': {'AppMain': {'name': 'AppMain', 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4b4da37d', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/AppMain/index.vue', '_Ctor': {}}, 'Navbar': {'components': {'Breadcrumb': {'components': {}, 'watch': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-b50ef614', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Breadcrumb/index.vue', '_Ctor': {}}, 'Hamburger': {'name': 'Hamburger', 'props': {'isActive': {'default': false}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4e6f274c', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Hamburger/index.vue', '_Ctor': {}}}, 'props': {'systemName': {'default': ''}, 'isLoginModule': {'default': false}, 'loginPath': {'default': '/jv-login'}, 'pREFIX': {'default': 'SAAS_'}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-c735de7a', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Navbar/index.vue', '_Ctor': {}}, 'Sidebar': {'components': {'SidebarItem': {'name': 'SidebarItem', 'components': {'Item': {'name': 'MenuItem', 'functional': true, 'props': {'icon': {'default': ''}, 'title': {'default': ''}}, '_scopeId': 'data-v-f8fde194', '__file': 'src/components/Sidebar/Item.vue', '_Ctor': {}}, 'AppLink': {'props': {'to': {'required': true}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Link.vue', '_Ctor': {}}}, 'mixins': [{'computed': {}, 'methods': {}}], 'props': {'item': {'required': true}, 'isNest': {'default': false}, 'basePath': {'default': ''}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/SidebarItem.vue', '_Ctor': {}}, 'Logo': {'name': 'SidebarLogo', 'props': {'collapse': {'required': true}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-93a96464', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Logo.vue', '_Ctor': {}}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-71667e42', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/index.vue', '_Ctor': {}}}, 'mixins': [{'watch': {}, 'methods': {}}], 'props': {'showMain': {'default': true}, 'systemName': {'default': ''}, 'isLoginModule': {'default': false}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-13877386', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/layout/index.vue', '_Ctor': {}}, 'redirect': '/home', 'children': [{'path': '/home', 'name': '首页', 'hidden': true, 'meta': {'title': '首页'}}, {'path': '/editPassword', 'name': 'editPassword', 'hidden': true, 'meta': {'title': '修改密码'}}]}, {'path': '/login', 'name': 'login', 'hidden': true, 'meta': {'title': '登录'}}, {'path': '/404', 'name': '404', 'hidden': true, 'meta': {'title': '404'}}, {'path': '/401', 'name': '401', 'hidden': true, 'meta': {'title': '401'}}, {'path': '/decorate', 'name': 'decorate'}, {'path': '/preview', 'name': 'preview'}, {'path': '/activity', 'name': 'activity', 'component': {'name': 'Vuex', 'components': {'AppMain': {'name': 'AppMain', 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4b4da37d', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/AppMain/index.vue', '_Ctor': {}}, 'Navbar': {'components': {'Breadcrumb': {'components': {}, 'watch': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-b50ef614', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Breadcrumb/index.vue', '_Ctor': {}}, 'Hamburger': {'name': 'Hamburger', 'props': {'isActive': {'default': false}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4e6f274c', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Hamburger/index.vue', '_Ctor': {}}}, 'props': {'systemName': {'default': ''}, 'isLoginModule': {'default': false}, 'loginPath': {'default': '/jv-login'}, 'pREFIX': {'default': 'SAAS_'}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-c735de7a', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Navbar/index.vue', '_Ctor': {}}, 'Sidebar': {'components': {'SidebarItem': {'name': 'SidebarItem', 'components': {'Item': {'name': 'MenuItem', 'functional': true, 'props': {'icon': {'default': ''}, 'title': {'default': ''}}, '_scopeId': 'data-v-f8fde194', '__file': 'src/components/Sidebar/Item.vue', '_Ctor': {}}, 'AppLink': {'props': {'to': {'required': true}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Link.vue', '_Ctor': {}}}, 'mixins': [{'computed': {}, 'methods': {}}], 'props': {'item': {'required': true}, 'isNest': {'default': false}, 'basePath': {'default': ''}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/SidebarItem.vue', '_Ctor': {}}, 'Logo': {'name': 'SidebarLogo', 'props': {'collapse': {'required': true}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-93a96464', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Logo.vue', '_Ctor': {}}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-71667e42', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/index.vue', '_Ctor': {}}}, 'mixins': [{'watch': {}, 'methods': {}}], 'props': {'showMain': {'default': true}, 'systemName': {'default': ''}, 'isLoginModule': {'default': false}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-13877386', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/layout/index.vue', '_Ctor': {}}, 'meta': {'title': '活动管理'}, 'children': [{'path': '/', 'hidden': true}]}, {'path': '/noRedirect0', 'component': {'name': 'Vuex', 'components': {'AppMain': {'name': 'AppMain', 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4b4da37d', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/AppMain/index.vue', '_Ctor': {}}, 'Navbar': {'components': {'Breadcrumb': {'components': {}, 'watch': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-b50ef614', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Breadcrumb/index.vue', '_Ctor': {}}, 'Hamburger': {'name': 'Hamburger', 'props': {'isActive': {'default': false}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-4e6f274c', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Hamburger/index.vue', '_Ctor': {}}}, 'props': {'systemName': {'default': ''}, 'isLoginModule': {'default': false}, 'loginPath': {'default': '/jv-login'}, 'pREFIX': {'default': 'SAAS_'}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-c735de7a', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Navbar/index.vue', '_Ctor': {}}, 'Sidebar': {'components': {'SidebarItem': {'name': 'SidebarItem', 'components': {'Item': {'name': 'MenuItem', 'functional': true, 'props': {'icon': {'default': ''}, 'title': {'default': ''}}, '_scopeId': 'data-v-f8fde194', '__file': 'src/components/Sidebar/Item.vue', '_Ctor': {}}, 'AppLink': {'props': {'to': {'required': true}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Link.vue', '_Ctor': {}}}, 'mixins': [{'computed': {}, 'methods': {}}], 'props': {'item': {'required': true}, 'isNest': {'default': false}, 'basePath': {'default': ''}}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/SidebarItem.vue', '_Ctor': {}}, 'Logo': {'name': 'SidebarLogo', 'props': {'collapse': {'required': true}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-93a96464', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/Logo.vue', '_Ctor': {}}}, 'computed': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-71667e42', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/components/Sidebar/index.vue', '_Ctor': {}}}, 'mixins': [{'watch': {}, 'methods': {}}], 'props': {'showMain': {'default': true}, 'systemName': {'default': ''}, 'isLoginModule': {'default': false}}, 'computed': {}, 'methods': {}, 'staticRenderFns': [], '_compiled': true, '_scopeId': 'data-v-13877386', 'beforeCreate': [null], 'beforeDestroy': [null], '__file': 'src/layout/index.vue', '_Ctor': {}}, 'name': '活动管理', 'redirect': 'noRedirect', 'meta': {'title': '活动管理', 'icon': ''}, 'children': []}, {'path': '*', 'redirect': '/401', 'hidden': true}]
    }
  },
  computed: {
    // ...mapGetters({
    //   permission_routes: 'permission/permission_routes',
    //   sidebar: 'app/sidebar'
    // }),
    activeMenu() {
      const route = this.$route
      const { meta, path } = route
      // if set path, the sidebar will highlight the path you set
      if (meta.activeMenu) {
        return meta.activeMenu
      }
      return path
    }
    // addRoutes() {
    //   return this.$auth.store.state.permission.addRoutes
    // },
    // isCollapse() {
    //   return !this.sidebar.opened
    // }
  },
  methods: {
    goHome() {
      this.$router.push('/home')
    }
  }
}
</script>

<style lang="less" scoped>
  .menu-nodata {
    padding-top: 25px;
    color: #ccc;
    text-align: center;
    font-size: 14px;
  }
  .system-title {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    text-align: center;
    // background-color: #288ce3;
    img {
      margin-right: 5px;
      width: 50px;
      height: 50px;
    }
  }
</style>
